/*json文本样式*/
pre {
    border-radius: 8px;
    border: 1px solid #ccc;
    padding: 15px;
    margin-top: 5px;
    min-height: 300px;
}

.string {
    color: green;
}

.number {
    color: darkorange;
}

.boolean {
    color: blue;
}

.null {
    color: magenta;
}

.key {
    color: red;
}

/*loading相关样式*/
.loading {
    width: 80px;
    height: 40px;
    margin: 0 auto;
    margin-top: 100px;
}

.loading span {
    display: inline-block;
    width: 8px;
    height: 100%;
    border-radius: 4px;
    background: lightgreen;
    -webkit-animation: load 1s ease infinite;
}

@-webkit-keyframes load {
    0%, 100% {
        height: 40px;
        background: lightgreen;
    }
    50% {
        height: 70px;
        margin: -15px 0;
        background: lightblue;
    }
}

.loading span:nth-child(2) {
    -webkit-animation-delay: 0.2s;
}

.loading span:nth-child(3) {
    -webkit-animation-delay: 0.4s;
}

.loading span:nth-child(4) {
    -webkit-animation-delay: 0.6s;
}

.loading span:nth-child(5) {
    -webkit-animation-delay: 0.8s;
}

/*一半宽度*/
.halfWidth {
    width: 50%;
}